/**
 * create by young (young2f@outlook.com) on 2020/9/12
 */


'use strict';
import React from 'react';
import {connect} from 'dva/index';
import {Button, Card, Col, DatePicker, Drawer, Form, Input, Popconfirm, Row, Select, Statistic, Table} from 'antd';

import styles from '../../index.less';
import ViewTitle from '../../../components/ViewTitle';
import FormBase from '../../../components/Base/FormBase';
import notify from "../../../components/NotificationExtra";
import {FormField, ModalView, SearchForm} from 'antd-extra';
import moment from 'moment';
import 'moment/locale/zh-cn';
import ModalSalesReturnOrderInbound from "../modal/ModalSalesReturnOrderInbound";

moment.locale('zh-cn');

const _ = require('lodash');
const {Option} = Select;
const table = 'SalesReturnGoodsOrder';
const title = '订单退货';

@Form.create()
@connect(({
            user,
            global,
            customer,
            sales,
            dict,
            material,
            store
          }) => ({...user, ...global, ...dict, ...material, ...customer, ...sales, ...store}))
export default class SalesReturnOfGoods extends FormBase {
  constructor(props) {
    super(props);
    this.state = {};
  }

  componentDidMount() {
    const {dispatch} = this.props;
    const payload = this.props.form.getFieldsValue();
    _.map(payload, (value, key) => {
      if (value === '') {
        payload[key] = undefined;
      }
    });
    dispatch && dispatch({
      type: 'global/getModel',
      payload: {table}
    });

    this.props.dispatch({
      type: 'sales/findReturnOrderMany',
      payload
    });
    dispatch && dispatch({
      type: 'customer/findMany',
      payload: {}
    });
  }

  onDelete = record => {
    const {code} = record;
    this.props.dispatch({
      type: 'sales/deleteOne',
      payload: {code}
    })
      .then(res => {
        this.requestReturn(res);
        this.componentDidMount();
      });
  };

  getTableCols = () => {
    const model = this.props[`${table}Model`];
    const temp = [];
    temp.push(...this.getTableColumns(model));

    temp.push(
      {
        title: '操作', dataIndex: 'operation', key: 'operation',
        width: 160, fixed: 'right',
        render: (value, record) => {
          return (
            <span>
           {<a style={{marginRight: '6px'}}
               onClick={() => this.setState({showDetail: true, record})}>详情</a>}
            </span>
          );
        }
      });
    return temp;

  };

  getSearchFields = () => {
    return [
      <FormField
        label="编码"
        name="salesOrderCode"
        key={1}
      >
        <Input allowClear placeholder={`请输入订单编码`}/>
      </FormField>,
      <FormField
        label="客户"
        name="customer"
        key={2}
      >
        <Input allowClear placeholder="请输入客户"/>
      </FormField>,

      <FormField
        label="创建时间"
        name="createdTs"
        key={3}
        initialValue={[this.getSearchStart1Months(), this.getDefaultSearchEndDate()]}
      >
        <DatePicker.RangePicker allowClear={true}
          // style={{ width: '150%' }}
        />
      </FormField>

    ];
  };

  render() {
    const {returnGoods = {}, _notify, form} = this.props;
    const {record = {}, showDetail, showStatistics} = this.state;

    if (_notify && this.state._notify !== _notify) {
      notify(_notify);
      this.state._notify = _notify;
    }

    const {amount, count, list} = returnGoods;
    return (
      <Form className={styles.content}>
        <ViewTitle
          title={`销售退货列表`}
          level={1}

        ></ViewTitle>
        <SearchForm
          style={{marginLeft: '6px', marginRight: '6px'}}
          onSearch={() => {
            this.state.current = 1;
            this.componentDidMount();
          }}
          onReset={this.handleReset}
          cols={4}
          min={8}
          expandText="展开"
          form={form}
        >
          {this.getSearchFields()}
        </SearchForm>

        <Table
          className={styles.antTable}
          bordered={true}
          columns={this.getTableCols()}
          dataSource={list}
          scroll={{x: true}}
          pagination={{
            current: this.state.current,
            total: this.state.total,
            showSizeChanger: true,
            onChange: page => {
              this.state.current = page;
              this.componentDidMount();
            },
            onShowSizeChange: (current, pageSize) => {
              this.state.current = 1;
              this.state.pageSize = pageSize;
              this.componentDidMount();
            }
          }}
          //  scroll={{ x: 1300 }}
        ></Table>

        {showDetail && <Drawer
          visible={showDetail}
          title={`${title}详情`}
          placement="left"
          width={'80%'}
          style={{padding: 0}}
          // maskClosable={false}
          onClose={() => {
            this.setState({showDetail: false});
            this.componentDidMount();
          }}
        >
          <ModalSalesReturnOrderInbound
            record={record}
          > </ModalSalesReturnOrderInbound>
        </Drawer>}
      </Form>
    );
  }
}


